import React, { useState } from 'react';
import { Table, TablePaginationConfig ,Button} from 'antd'
import '../style/from.scss'
function From(props) {
    var list = [...props.list]
    var [headerlist, setHeaderlist] = useState([...list])
    var [pagination, setPagination] = useState(
        {
            total: props.total,
        })
    // 回调返回分页数据
    var [page, setPage] = useState({})
    props.page(page)
    // 回调返回复选框的数据
    var [ckeckbox, setCkeckbox] = useState({})
    props.ckeckbox(ckeckbox)
    const [selectedRowKeys, setSelectedRowKeys] = useState([]);
    // 分页触发的事件
    const handleChange = (pagination) => {
        console.log("from", pagination);
        setPage(pagination)
    }
    // 复选框选中的数据
    const onSelectChange = (newSelectedRowKeys) => {
        console.log('selectedRowKeys changed: ', newSelectedRowKeys);
        setSelectedRowKeys(newSelectedRowKeys);
        setCkeckbox(newSelectedRowKeys)
    };
    const rowSelection = {
        selectedRowKeys,
        onChange: onSelectChange,
    };
    return (
        <div className='from'>
            <Table
                columns={headerlist}
                dataSource={props.formlist}
                pagination={pagination}
                onChange={handleChange}
                size="large"
                rowSelection={rowSelection} />

        </div>
    );
}

export default From;